<template>
  <div class="choose">
    <div v-for="(item,index) in list" :key="index">
      <ChooseItem
        @add="add"
        :info="item"
        :index="index"
        :length="list.length"
        @move="move"
        @remove="remove"
      />
    </div>
  </div>
</template>
<script>
import ChooseItem from "./chooseItem";
import { swapArray } from "@/utils";
export default {
  components: {
    ChooseItem
  },
  props:['list'],
  methods: {
    add(data) {
      this.list.push({
        length: "",
        type: 1,
        price: "",
        desc: ""
      });
      this.$emit("change", this.list);
    },

    move(from, to) {
      this.list = swapArray(this.list, from, to);
      this.$emit("change", this.list);
    },
    remove(index) {
      this.list.splice(index, 1);
      this.$emit("change", this.list);
    }
  }
};
</script>
<style lang="scss" scoped>
</style>